<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/7/28
  Time: 17:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layout 后台大布局 - Layui</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">

</head>
<body class="layui-layout-body">
<button type="button" class="layui-btn" id="add">一个标准的按钮</button>
<div id="resourceTree"></div>
<script src="${pageContext.request.contextPath}/layui/layui.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
    layui.use('tree', function(){
        var tree = layui.tree;
        //渲染
        $.ajax({
            url:"layui-resource/selectResTree",
            dataType:"json",
            success:function(data){
                tree.render({
                    elem: '#resourceTree'  //绑定元素
                    ,data:data
                    ,showCheckbox:true
                    ,id:'nodeId'
                });
            }
        });
        $("#add").click(function () {
            var checkData = tree.getChecked('nodeId');
            console.log(getCheckedNodeId(checkData));
        })
        function getCheckedNodeId(data) {
            var res = "";
            $.each(data, function (index, item) {
                if (res != "") {
                    res = res + "&resourceId=" + item.id;
                }
                else {
                    res = "resourceId="+item.id;
                }
                if(item.children!=undefined) {
                    var i = getCheckedNodeId(item.children);
                    if (i!="") {
                        res = res + "&" + i;
                    }
                }
            });
            return res;
        }
    });
</script>
</body>
</html>
